<script setup lang="ts">
// This starter template is using Vue 3 <script setup> SFCs
// Check out https://vuejs.org/api/sfc-script-setup.html#script-setup
import { computed, ref, onMounted } from 'vue';
import ButtonStatus from '../demos/button/status.vue';
import CalculatorBasic from '../demos/calculator/basic.vue';
import CalendarBasic from '../demos/calendar/basic.vue';
import CapsuleBasic from '../demos/capsule/basic.vue';
import ColorPickerBasic from '../demos/color-picker/basic.vue';
import ComboListBasic from '../demos/combo-list/basic.vue';
import ComboListCascade from '../demos/combo-list/cascade.vue';
import DataGridBasic from '../demos/data-grid/basic.vue';
import DataGridBindingLocalData from '../demos/data-grid/binding_local_data.vue';
import DataGridPageLocalData from '../demos/data-grid/page_local_data.vue';
import DataGridEditLocalData from '../demos/data-grid/edit_local_data.vue';
import DataGridFilterLocalData from '../demos/data-grid/filter_local_data.vue';
import DataGridGroupLocalData from '../demos/data-grid/group_local_data.vue';
import DatePickerBasic from '../demos/date-picker/basic.vue';
import DiscussionEditorBasic from '../demos/discussion-editor/basic.vue';
import DiscussionListBasic from '../demos/discussion-list/basic.vue';
import DropdownBasic from '../demos/dropdown/basic.vue';
import DesignerCanvasBasic from '../demos/designer-canvas/basic.vue';
import DesignerCanvasListCard from '../demos/designer-canvas/list-card.vue';
import DesignerDragOver from '../demos/designer-canvas/drag-over.vue';
import DynamicViewBasic from '../demos/dynamic-view/basic.vue';
import DynamicViewListDictionary from '../demos/dynamic-view/list-dictionary.vue';
import DynamicViewCard from '../demos/dynamic-view/card.vue';
import DynamicViewListCard from '../demos/dynamic-view/list-card.vue';
import FilterBarBasic from '../demos/filter-bar/basic.vue';
import ImageCropperBasic from '../demos/image-cropper/basic.vue';
import InputGroup from '../demos/input-group/basic.vue';
import ListNavBasic from '../demos/list-nav/basic.vue';
import ListViewBasic from '../demos/list-view/basic.vue';
import ListViewCommon from '../demos/list-view/common.vue';
import ListViewCard from '../demos/list-view/card.vue';
import ListViewSingleItem from '../demos/list-view/single-item.vue';
import LoadingBasic from '../demos/loading/basic.vue';
import LoadingShow from '../demos/loading/show.vue';
import MessageBoxBasic from '../demos/message-box/basic.vue';
import MessageBoxTypes from '../demos/message-box/types.vue';
import MessageBoxPrompt from '../demos/message-box/prompt.vue';
import MessageBoxErrors from '../demos/message-box/errors.vue';
import MessageBoxQuestion from '../demos/message-box/question.vue';
import ModalBasic from '../demos/modal/basic.vue';
import ModalService from '../demos/modal/modal-service.vue';
import NavBasic from '../demos/nav/basic.vue';
import NumberRangeBasic from '../demos/number-range/basic.vue';
import NumberSpinnerBasic from '../demos/number-spinner/basic.vue';
import OrderBasic from '../demos/order/basic.vue';
import PageFooterBasic from '../demos/page-footer/basic.vue';
import PageHeaderBasic from '../demos/page-header/basic.vue';
import PaginationBasic from '../demos/pagination/basic.vue';
import PaginationSimple from '../demos/pagination/simple.vue';
import PopoverBasic from '../demos/popover/basic.vue';
import ProgressBasic from '../demos/progress/basic.vue';
import PropertyPanelBasic from '../demos/property-panel/basic.vue';
import QueryConditonConditionList from '../demos/query-condition/condition-list.vue';
import RadioGroupBasic from '../demos/radio-group/basic.vue';
import RadioGroupDisable from '../demos/radio-group/disable.vue';
import RadioGroupAlignment from '../demos/radio-group/alignment.vue';
import RateBasic from '../demos/rate/basic.vue';
import ResponseToolbarBasic from '../demos/response-toolbar/basic.vue';
import SectionBasic from '../demos/section/basic.vue';
import SplitterBasic from '../demos/splitter/basic.vue';
import SplitterPane from '../demos/splitter/pane.vue';
import StepBasic from '../demos/step/basic.vue';
import SwitchBasic from '../demos/switch/basic.vue';
import TabsBasic from '../demos/tabs/basic.vue';
import TabsClose from '../demos/tabs/close.vue';
import TabsDisable from '../demos/tabs/disable.vue';
import TabsHide from '../demos/tabs/hide.vue';
import TagsBasic from '../demos/tags/basic.vue';
import TimePickerBasic from '../demos/time-picker/basic.vue';
import TransferBasic from '../demos/transfer/basic.vue';
import TreeViewBasic from '../demos/tree-view/basic.vue';
import TreeViewChangeValueBasic from '../demos/tree-view/change_value.vue';
import UploaderBasic from '../demos/uploader/basic.vue';
import VerifyDetailBasic from '../demos/verify-detail/basic.vue';
import QuerySolutionBasic from '../demos/query-solution/basic.vue';
import ExtendPanelDragOver from '../demos/extend-panel/drag-over.vue';
import ExtendCalendarBasic from '../demos/extend-calendar/_basic.vue';
import ExtendCalendarDragOver from '../demos/extend-calendar/drag-over.vue';
import MeterGroupBasic from '../demos/meter-group/basic.vue';
import DialBasic from '../demos/dial/basic.vue';
import DialDragOver from '../demos/dial/drag-over.vue';
import  FAiMaster  from '../demos/aimaster/basic.vue';

const routes: Record<string, any> = {
    '/': DataGridBasic,
    '/button/status': ButtonStatus,
    '/calendar/basic': CalendarBasic,
    '/calculator/basic': CalculatorBasic,
    '/capsule/basic': CapsuleBasic,
    '/color-picker/basic': ColorPickerBasic,
    '/combo-list/basic': ComboListBasic,
    '/combo-list/cascade': ComboListCascade,
    '/data-grid/basic': DataGridBasic,
    '/data-grid/binding_local_data': DataGridBindingLocalData,
    '/data-grid/page_local_data': DataGridPageLocalData,
    '/data-grid/edit_local_data': DataGridEditLocalData,
    '/data-grid/filter_local_data': DataGridFilterLocalData,
    '/data-grid/group_local_data': DataGridGroupLocalData,
    '/date-picker/basic': DatePickerBasic,
    '/discussion-editor/basic': DiscussionEditorBasic,
    '/discussion-list/basic': DiscussionListBasic,
    '/dropdown/basic': DropdownBasic,
    '/designer-canvas/basic': DesignerCanvasBasic,
    '/designer-canvas/list-card': DesignerCanvasListCard,
    '/designer-canvas/drag-over': DesignerDragOver,
    '/dynamic-view/basic': DynamicViewBasic,
    '/dynamic-view/list-dictionary': DynamicViewListDictionary,
    '/dynamic-view/card': DynamicViewCard,
    '/dynamic-view/list-card': DynamicViewListCard,
    '/filter-bar/basic': FilterBarBasic,
    '/image-cropper/basic': ImageCropperBasic,
    '/input-group/basic': InputGroup,
    '/list-nav/basic': ListNavBasic,
    '/list-view/basic': ListViewBasic,
    '/list-view/common': ListViewCommon,
    '/list-view/card': ListViewCard,
    '/list-view/single-item': ListViewSingleItem,
    '/loading/basic': LoadingBasic,
    '/loading/show': LoadingShow,
    '/message-box/basic': MessageBoxBasic,
    '/message-box/types': MessageBoxTypes,
    '/message-box/prompt': MessageBoxPrompt,
    '/message-box/errors': MessageBoxErrors,
    '/message-box/question': MessageBoxQuestion,
    '/modal/basic': ModalBasic,
    '/modal/modal-service': ModalService,
    '/nav/basic': NavBasic,
    '/number-range/basic': NumberRangeBasic,
    '/number-spinner/basic': NumberSpinnerBasic,
    '/order/basic': OrderBasic,
    '/page-footer/basic': PageFooterBasic,
    '/page-header/basic': PageHeaderBasic,
    '/pagination/basic': PaginationBasic,
    '/pagination/simple': PaginationSimple,
    '/popover/basic': PopoverBasic,
    '/progress/basic': ProgressBasic,
    '/property-panel/basic':PropertyPanelBasic,
    '/query-condition/condition-list': QueryConditonConditionList,
    '/rate/basic': RateBasic,
    '/radio-group/basic': RadioGroupBasic,
    '/radio-group/disable': RadioGroupDisable,
    '/radio-group/alignment': RadioGroupAlignment,
    '/response-toolbar/basic': ResponseToolbarBasic,
    '/section/basic': SectionBasic,
    '/splitter/basic': SplitterBasic,
    '/splitter/pane': SplitterPane,
    '/step/basic': StepBasic,
    '/switch/basic': SwitchBasic,
    '/tabs/basic': TabsBasic,
    '/tabs/close': TabsClose,
    '/tabs/disable': TabsDisable,
    '/tabs/hide': TabsHide,
    '/tags/basic': TagsBasic,
    '/time-picker/basic': TimePickerBasic,
    '/transfer/basic': TransferBasic,
    '/tree-view/basic': TreeViewBasic,
    '/tree-view/change_value_basic': TreeViewChangeValueBasic,
    '/uploader/basic': UploaderBasic,
    '/verify-detail/basic': VerifyDetailBasic,
    '/query-solution/basic': QuerySolutionBasic,
    '/extend-panel/drag-over':ExtendPanelDragOver,
    '/extend-calendar/basic':ExtendCalendarBasic,
    '/extend-calendar/drag-over':ExtendCalendarDragOver,
    '/meter-group/basic': MeterGroupBasic,
    '/dial/basic': DialBasic,
    '/dial/drag-over': DialDragOver,
    '/aimaster/basic': FAiMaster,
};

const currentPath = ref(window.location.hash);

const currentView = computed(() => {
    const routePath: string = `/${currentPath.value.slice(1)}` || '/';
    return routes[routePath] || DataGridBasic;
});

onMounted(() => {
    window.addEventListener('hashchange', () => {
        currentPath.value = window.location.hash;
    });
});
</script>
<template>
    <component :is="currentView" />
</template>
